import { createRouter, createWebHistory } from 'vue-router';

// 定义路由
const routes = [
  {
    path: '/',
    name: 'Home',
    component: () => import('../views/HomeView.vue'),
    meta: {
      title: '衣橱首页'
    }
  },
  {
    path: '/login',
    name: 'Login',
    component: () => import('../views/LoginView.vue'),
    meta: {
      title: '登录'
    }
  },
  {
    path: '/register',
    name: 'Register',
    component: () => import('../views/RegisterView.vue'),
    meta: {
      title: '注册'
    }
  },
  {
    path: '/clothes',
    name: 'ClothesList',
    component: () => import('../views/ClothesListView.vue'),
    meta: {
      title: '我的衣橱'
    }
  },
  {
    path: '/clothes/add',
    name: 'AddClothes',
    component: () => import('../views/AddClothesView.vue'),
    meta: {
      title: '添加衣物'
    }
  },
  {
    path: '/clothes/:id',
    name: 'ClothesDetail',
    component: () => import('../views/ClothesDetailView.vue'),
    meta: {
      title: '衣物详情'
    }
  },
  {
    path: '/outfits',
    name: 'Outfits',
    component: () => import('../views/OutfitsView.vue'),
    meta: {
      title: '我的搭配'
    },
  },
  {
    // 设置id占位符，用于搭配详情路由
    // :id 表示动态路由参数，用于匹配搭配的具体ID
    path: '/outfits/create/:id?',
    name: 'CreateOutfit',
    component: () => import('../views/CreateOutfitView.vue'),
    meta: {
      title: '创建搭配'
    }
  },
  {
    path: '/outfits/:id',
    name: 'OutfitDetail',
    component: () => import('../views/OutfitDetailView.vue'),
    meta: {
      title: '搭配详情'
    }
  },
  {
    path: '/outfits/edit/:id',
    name: 'EditOutfitDetail',
    component: () => import('../views/EditOutfitDetailView.vue'),
    meta: {
      title: '编辑搭配'
    }
  },
  {
    path: '/statistics',
    name: 'Statistics',
    component: () => import('../views/StatisticsView.vue'),
    meta: {
      title: '统计分析'
    }
  },
  {
    path: '/profile',
    name: 'Profile',
    component: () => import('../views/ProfileView.vue'),
    meta: {
      title: '个人中心'
    }
  },
  {
    path: '/user',
    name: 'UserCenter',
    component: () => import('../views/UserCenterView.vue'),
    meta: {
      title: '用户中心'
    }
  },
  {
    path: '/avatar-edit',
    name: 'AvatarEdit',
    component: () => import('../views/AvatarEditView.vue'),
    meta: {
      title: '修改头像'
    }
  },
  {
    path: '/:pathMatch(.*)*',
    name: 'NotFound',
    component: () => import('../views/NotFoundView.vue'),
    meta: {
      title: '页面不存在'
    }
  },
  {
    path: '/clothes/edit/:id',
    name: 'EditClothes',
    component: () => import('../views/AddClothesView.vue'),
    meta: {
      title: '编辑衣物'
    }
  },
  {
    path: '/weather',
    name: 'Weather',
    component: () => import('../views/WeatherView.vue'),
    meta: {
      title: '天气详情'
    }
  },
  {
    path: '/clothes/upload',
    name: 'UploadClothes',
    component: () => import('../views/UploadClothesView.vue'),
    meta: {
      title: '上传衣物'
    }
  },
  {
    path: '/clothes/category',
    name: 'CategoryDetail',
    component: () => import('../views/CategoryDetailView.vue'),
    meta: {
      title: '分类详情'
    }
  },
  {
    path: '/clothes-category/:categoryId',
    name: 'ClothesCategory',
    component: () => import('../views/ClothesCategoryView.vue'),
    meta: {
      title: '衣物分类'
    }
  },
];

const router = createRouter({
  history: createWebHistory(),
  routes,
  scrollBehavior(to, from, savedPosition) {
    // 始终滚动到顶部
    return { top: 0 }
  }
});

// 全局路由守卫
router.beforeEach((to, from, next) => {
  // 设置页面标题
  if (to.meta.title) {
    document.title = to.meta.title;
  }

  // 这里可以添加认证逻辑
  // const isAuthenticated = localStorage.getItem('token');
  // if (to.matched.some(record => record.meta.requiresAuth) && !isAuthenticated) {
  //   next({ name: 'Login' });
  // } else {
  //   next();
  // }

  next();
});

export default router;